<template>
  <h1>Child</h1>
  <p>{{ count }}</p>
  <button @click="handleClick">更新</button>
</template>

<script lang="ts">
export default {
  // 给组件取名字，名字在vue开发者调试工具中查看
  name: "Child",
};
</script>

<script lang="ts" setup>
// 不需要引入，每个组件可以直接使用
// 声明接受props
const props = defineProps<{
  count: number;
}>();

console.log(props.count);

// 声明接受自定义事件
const emit = defineEmits(["setCount"]);

const handleClick = () => {
  // 触发自定义事件
  emit("setCount");
};
</script>

<style scoped></style>
